<template>
    <div class="custom-input">
        <span class="label">{{config.fieldName}}</span>
        <el-select v-model="cvalue" :placeholder="config.filterComOptions.placeholder" :clearable="true" class="filter-input">
            <el-option v-for="item in config.filterComOptions.options" :key="item.value" :label="item.name" :value="item.value" />
        </el-select>
    </div>
</template>

<script>
    export default {
        name: "customSelect",
        data() {
            return {
                cvalue:''
            }
        },
        props:{
            value:{
                type:[String,Number],
                default:'',
            },
            config:{
                type:[Object],
                default:{
                    type:'input',//类型 string	text，textarea 和其他 原生 input 的 type 值	text
                    style:"width:300px;height:40px;",//样式
                    value:'',// v-model	绑定值	string / number
                    maxlength:'',//	原生属性，最大输入长度	number	—	—
                    minlength:'',//	原生属性，最小输入长度	number	—	—
                    showWordLimit:'',//	是否显示输入字数统计，只在 type = "text" 或 type = "textarea" 时有效	boolean	—	false
                    placeholder:'',//	输入框占位文本	string	—	—
                    clearable:'',//	是否可清空
                    options:[{label:'测试1',value:1},{label:'测试2',value:2}]
                },
            }
        },
        watch:{
            value(val){
                this.cvalue=val;
            },
            cvalue(val){
                this.$emit('input',val);
                this.$emit('change',val)
            }
        }
    }
</script>

<style scoped lang="stylus">
    @import "comp.styl"
</style>
